import React from 'react';
import { View, Text, Button } from 'react-native';


class DetailsScreen extends React.Component {

  state = {
    count: 0
  }

  static navigationOptions = ({ navigation, navigationOptions }) => {
    const { params } = navigation.state;
    return {
      title: params.testId+'news',
      headerLeft: (<Text
        onPress={()=>{
          navigation.goBack();
        }}
        style={{color: 'white', paddingLeft: 10}}
        >
        返回
      </Text>),
      headerRight: (<Text
        onPress={navigation.getParam('getCount')}
        style={{color: 'white', marginRight: 10}}>
        计数
      </Text>)
    };
  };

  addCount = () => {
    this.setState({
      count: this.state.count+1
    })
  }

  componentDidMount(){
    this.props.navigation.setParams({
      getCount: this.addCount
    })
  }
  render() {
    const { navigation } = this.props;
    console.log(navigation)
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Details Screen</Text>
        <Text>计数大小: {this.state.count}</Text>
        <Text>{navigation.getParam('testId')}</Text>
        <Text>{navigation.state.params.testId}</Text>
        <Text onPress={()=>{
          navigation.setParams({
            testId: '321'
          })
        }}>
          改变参数
        </Text>
        <Text onPress={()=>{
          this.props.navigation.navigate('News')
        }}>News Screen</Text>
        <Text onPress={()=>{
          this.props.navigation.goBack();
        }}>返回goback</Text>
         <Text onPress={()=>{
          this.props.navigation.pop();
        }}>返回pop</Text>

      </View>
    );
  }
}

export default DetailsScreen
